<!doctype html>
<html class="no-js">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="description" content="">
    <meta name="keywords" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>{$system_name}</title>
    <!-- Set render engine for 360 browser -->
    <meta name="renderer" content="webkit">
    <!-- No Baidu Siteapp-->
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <!-- Add to homescreen for Chrome on Android -->
    <meta name="mobile-web-app-capable" content="yes">
    <!-- Add to homescreen for Safari on iOS -->
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-title" content="Amaze UI"/>
    <!-- Tile icon for Win8 (144x144 + tile color) -->
    <meta name="msapplication-TileColor" content="#0e90d2">
    <!-- SEO: If your mobile URL is different from the desktop URL, add a canonical link to the desktop page https://developers.google.com/webmasters/smartphone-sites/feature-phones -->
    <!--
  <link rel="canonical" href="http://www.example.com/">
  -->
    <link rel="stylesheet" href="__PUBLIC__/assets/css/amazeui.min.css">
    <link rel="stylesheet" href="__PUBLIC__/assets/css/app.css">
    <!--<link rel="stylesheet" href="__PUBLIC__/assets/css/index.css">-->
    <!--必要样式-->
    <style>
        .wrap {
            height: 270px;
            background: #333;
            color: #FFF;
            font-size: 12px;
        }

        .wrap .nick, .idnum {
            line-height: 24px;
            display: block;
        }

        .jfnum {
            display: inline-block;
            font-size: 18px;
        }

        .btn {
            display: inline-block;
            color: #FFE079;
            font-size: 15px;
            border-radius: 5px;
            border: 1px solid #FFE079;
            width: 74px;
            text-align: center;
            line-height: 26px;
            margin: 0 10%;
        }

        .num {
            display: block;
            position: absolute;
            top: -13px;
            right: 20%;
            z-index: 999;
            width: 18px;
            line-height: 18px;
            height: 18px;
            font-size: 12px;
            color: #fff;
            background: #F00;
            border-radius: 50%;
        }

        .info {
            margin: 0 20px 10px 0;
        }

        .info-right {
            border-bottom: 1px solid #BFBFBF;
            line-height: 42px
        }

        .info .text {
            float: left;
            font-size: 15px;
            color: #333;
        }

        .opacity {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: #000;
            opacity: 0.5;
            filter: alpha(opacity=50);
            z-index: 1050;
            width: 100%;
            height: 100%;
            display: none;
        }

        .introduce {
            position: fixed;
            top: 0;
            width: 100%;
            z-index: 1100;
            display: none;
            height: 100%;
        }

        .introduce-box {
            width: 100%;
            margin: 0 auto;
            height: 90%;
            margin-top: 25px;
            text-align: center;
        }
        .content-box{
            position: absolute;
            width: 70%;
            height: 70%;
            text-align: left;
            top: 15%;
            left: 15%;
            z-index: 9999;
            overflow-y: scroll;
            display: none;
        }
        ::-webkit-scrollbar {display:none}
        .go_moeny {
            color: #F6DB7F;
            display: block;
            border: 1px solid #F6DB7F;
            border-radius: 10px;
            width: auto;
            text-align: center;
            height: 22px;
            line-height: 22px;
            padding: 0 3px;
            font-size: 9px;
            position: absolute;
            right: 8%;
            bottom:0;
        }
        .go_zs{
            color: #F6DB7F;
            display: block;
            border: 1px solid #F6DB7F;
            border-radius: 10px;
            width: auto;
            text-align: center;
            height: 22px;
            line-height: 22px;
            padding: 0 3px;
            font-size: 9px;
            position: absolute;
            left: 12%;
            bottom:0;
        }
        .close_scroll{
            position: absolute;right: 40px;z-index: 99999;
            top:35px;
        }
    </style>

</head>

<body>
<header data-am-widget="header" class="am-header am-header-default">

    <h1 class="am-header-title">
        <a href="#title-link" class="">
            个人中心
        </a>
    </h1>

</header>

<div class="am-g wrap">
    <div class="am-u-sm-12 am-text-center" style="position: relative">
        <!--<span style="color: #FFF;font-size: 12px;position: absolute;top: 10px;left: 10px;">浏览量：400</span>-->
        <img src="{$user.head_url}" width="70" height="70" class="am-round" alt="">
        <span class="nick" style="font-size: 14px">ID:{$user.id}&nbsp;&nbsp;&nbsp;{$user.nickname}</span>
        <eq name="user.user_type" value="1">
            <span class="nick" style="font-size: 14px">浏览量&nbsp;&nbsp;&nbsp;{$user.show_pageviews}</span>
        </eq>
        <span class="idnum"></span>
        <span class="idnum">1v1 胜率:{$ranking_1.percentage}%&nbsp;&nbsp;&nbsp;胜场/总场数:{$ranking_1.win_number}/{$ranking_1.total_number}&nbsp;&nbsp;&nbsp;rank:{$ranking_1.ranking}</span>
        <span class="idnum">3v3 胜率:{$ranking_3.percentage}%&nbsp;&nbsp;&nbsp;胜场/总场数:{$ranking_3.win_number}/{$ranking_3.total_number}&nbsp;&nbsp;&nbsp;rank:{$ranking_3.ranking}</span>
        <span class="idnum">5v5 胜率:{$ranking_5.percentage}%&nbsp;&nbsp;&nbsp;胜场/总场数:{$ranking_5.win_number}/{$ranking_5.total_number}&nbsp;&nbsp;&nbsp;rank:{$ranking_5.ranking}</span>
        <span class="jfnum" style="margin-right: 15px"  id="zuanshi">
            <img src="__PUBLIC__/assets/i/diamond.png" width="20" alt="" style="display: inline-block;margin-top: -3px;">{$user.integral|round}</span>
        <span class="jfnum">
            <img src="__PUBLIC__/assets/i/coin.png" width="16" alt="" style="display: inline-block;margin-top: -3px;">{$user.gold|round}</span>
        <span class="go_moeny" onclick="showScroll(0)" >如何赚取金币？</span>
        <span class="go_zs" onclick="showIntegral(1)" >钻石的作用？</span>
    </div>
    <div class="am-u-sm-12 am-text-center" style="margin-top: 15px">
        <a href="__APP__/Home/Recharge/new_index"><span class="btn">充值</span></a>
        <a href="__URL__/messageLog" style="position: relative"><span class="btn">消息</span>
            <neq name="messageCount" value="0"><span class="num">{$messageCount}</span></neq>
        </a>

    </div>
</div>


<div class="info">
    <a href="__APP__/Home/Me/matchLog">
        <div class="info-item am-g">
            <div class="am-u-sm-2 am-text-right  ">
                <img src="__PUBLIC__/assets/i/me3.png" width="24" alt="" style="margin-top: 10px">
            </div>
            <div class="am-u-sm-10 am-text-right am-padding-0 info-right">
                <span class="text">我的比赛记录</span>
                <img src="__PUBLIC__/assets/i/right.png" width="10" alt="">
            </div>
        </div>
    </a>
    <a href="__APP__/Home/Me/moneyLog">
        <div class="info-item am-g">
            <div class="am-u-sm-2 am-text-right  ">
                <img src="__PUBLIC__/assets/i/me1.png" width="24" alt="" style="margin-top: 10px">
            </div>
            <div class="am-u-sm-10 am-text-right am-padding-0 info-right">
                <span class="text">交易记录</span>
                <img src="__PUBLIC__/assets/i/right.png" width="10" alt="">
            </div>
        </div>
    </a>

    <a href="__APP__/Home/Me/order">
        <div class="info-item am-g">
            <div class="am-u-sm-2 am-text-right  ">
                <img src="__PUBLIC__/assets/i/me2.png" width="24" alt="" style="margin-top: 10px">
            </div>
            <div class="am-u-sm-10 am-text-right am-padding-0 info-right">
                <span class="text">我的领奖记录</span>
                <img src="__PUBLIC__/assets/i/right.png" width="10" alt="">
            </div>
        </div>
    </a>

    <a href="__APP__/Home/Me/matchLog">
        <div class="info-item am-g">
            <div class="am-u-sm-2 am-text-right  ">
                <img src="__PUBLIC__/assets/i/me3.png" width="24" alt="" style="margin-top: 10px">
            </div>
            <div class="am-u-sm-10 am-text-right am-padding-0 info-right">
                <span class="text">我的比赛记录</span>
                <img src="__PUBLIC__/assets/i/right.png" width="10" alt="">
            </div>
        </div>
    </a>

    <a href="__APP__/Home/Me/roomList">
        <div class="info-item am-g">
            <div class="am-u-sm-2 am-text-right  ">
                <img src="__PUBLIC__/assets/i/ring.png" width="24" alt="" style="margin-top: 10px">
            </div>
            <div class="am-u-sm-10 am-text-right am-padding-0 info-right">
                <span class="text">我的擂台记录</span>
                <img src="__PUBLIC__/assets/i/right.png" width="10" alt="">
            </div>
        </div>
    </a>

    <eq name="user.user_type" value="1">
        <a href="__APP__/Home/Me/myAgent">
            <div class="info-item am-g">
                <div class="am-u-sm-2 am-text-right  ">
                    <img src="__PUBLIC__/assets/i/me4.png" width="24" alt="" style="margin-top: 10px">
                </div>
                <div class="am-u-sm-10 am-text-right am-padding-0 info-right">
                    <span class="text">我的客户</span>
                    <img src="__PUBLIC__/assets/i/right.png" width="10" alt="">
                </div>
            </div>
        </a>
    </eq>

    <!--非代理用户申请代理-->
    <!--<eq name="user.user_type" value="0">-->
        <!--<a href="__APP__/Home/Me/applyAgent">-->
            <!--<div class="info-item am-g">-->
                <!--<div class="am-u-sm-2 am-text-right  ">-->
                    <!--<img src="__PUBLIC__/assets/i/apply_agent.png" width="24" alt=""  style="margin-top: 10px">-->
                <!--</div>-->
                <!--<div class="am-u-sm-10 am-text-right am-padding-0 info-right">-->
                    <!--<span class="text">申请代理</span>-->
                    <!--<img src="__PUBLIC__/assets/i/right.png" width="10" alt="">-->
                <!--</div>-->
            <!--</div>-->
        <!--</a>-->
    <!--</eq>-->
    <eq name="user.user_type" value="1">
        <a href="__URL__/pushCodeNew">
            <div class="info-item am-g">
                <div class="am-u-sm-2 am-text-right  ">
                    <img src="__PUBLIC__/assets/i/me5.png" width="24" alt="" style="margin-top: 10px">
                </div>
                <div class="am-u-sm-10 am-text-right am-padding-0 info-right">
                    <span class="text">我的推广二维码</span>
                    <img src="__PUBLIC__/assets/i/right.png" width="10" alt="">
                </div>
            </div>
        </a>
    </eq>

    <a href="__APP__/Home/Me/customerCode">
        <div class="info-item am-g">
            <div class="am-u-sm-2 am-text-right  ">
                <img src="__PUBLIC__/assets/i/me6.png" width="24" alt="" style="margin-top: 10px">
            </div>
            <div class="am-u-sm-10 am-text-right am-padding-0 info-right">
                <span class="text">客服</span>
                <img src="__PUBLIC__/assets/i/right.png" width="10" alt="">
            </div>
        </div>
    </a>

    <a href="__APP__/Home/Me/modifyPasswordUI">
        <div class="info-item am-g">
            <div class="am-u-sm-2 am-text-right  ">
                <img src="__PUBLIC__/assets/i/me7.png" width="24" alt="" style="margin-top: 10px">
            </div>
            <div class="am-u-sm-10 am-text-right am-padding-0 info-right">
                <span class="text">修改密码</span>
                <img src="__PUBLIC__/assets/i/right.png" width="10" alt="">
            </div>
        </div>
    </a>

    <a href="__APP__/Home/Index/settings">
        <div class="info-item am-g">
            <div class="am-u-sm-2 am-text-right  ">
                <img src="__PUBLIC__/assets/i/me7.png" width="24" alt="" style="margin-top: 10px">
            </div>
            <div class="am-u-sm-10 am-text-right am-padding-0 info-right">
                <span class="text">设置</span>
                <img src="__PUBLIC__/assets/i/right.png" width="10" alt="">
            </div>
        </div>
    </a>


</div>

<div class="opacity"></div>
<div class="introduce">
    <div class="introduce-box" style="">
        <img src="__PUBLIC__/assets/i/close_scroll.png" width="30" alt="" onclick="hideScroll()"  class="close_scroll">
        <img src="__PUBLIC__/images/juanzhou.png" class="juanzhou" width="90%" alt="">
        <div class="content-box" id="show_content">

        </div>
    </div>
</div>
<!--[if (gte IE 9)|!(IE)]><!-->
<script src="__PUBLIC__/assets/js/jquery.min.js"></script>
<script src="__PUBLIC__/assets/js/angular.min.js"></script>
<script src="__PUBLIC__/assets/js/amazeui.min.js"></script>
<script src="__PUBLIC__/layer/layer.js"></script>
<include file="Public:nav_bottom" />
<script type="text/javascript">
    $(window).load(function () {
        var windowHeight = $(window).height();
        console.log(windowHeight)
        $('.juanzhou').css('height',windowHeight-50);
        var is_show_info = '{$is_show_info}';
        if(is_show_info == 1){
            layer.confirm('恭喜您获得500金币，是否前往进行抽奖？', {
                btn: ['立即前往','稍后再说'] //按钮
            }, function(){
                window.location.href = '__APP__/Home/Lottery';
            }, function(){

            });
//
//            showScroll(0);
        }
    });

    function showScroll(money_type){
        layer.closeAll();
        var content = '';
        if(money_type == 0){
            content = '{$gold_content}';
        }else{
            content = '{$integral_content}';
        }
        $('#show_content').empty().html(content);
        $('.opacity').show();
        $('.introduce').slideDown(3000);
        setTimeout(function(){
            $('.content-box').fadeIn(1500);
        },3000);
    }
    function showIntegral(){
        layer.alert('{$integral_content}',{title:'钻石的作用'});

    }
    function hideScroll(){
        $('.opacity').hide();
        $('.introduce').hide();
        $('.content-box').hide();
        var is_show_info = '{$is_show_info}';
        if(is_show_info == 1){
            showUse();
        }
    }


    function showUse(){
//        var is_show_info = '{$is_show_info}';
//        if(is_show_info == 0){
//            return;
//        }
        layer.tips('钻石的作用', '#zuanshi',{
            tips:1,
            time:0
        });
        $('#layui-layer1').click(function(){
            window.location.href = '__APP__/Home/Me/integralEffect';
        })
    }

</script>
</body>
</html>

